<!doctype html>
<html>

	<head>
		<meta charset="UTF-8" />
		<title>我</title>
		<link rel="stylesheet" href="../css/common.css" />
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="../css/mui.css" />
		<script src="../js/mui.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			mui.init();
			if (location.pathname != "/h5/html/login.html" && typeof(sessionStorage.token) == "undefined") {

				mui.openWindow({
					url: 'login.html',

				});
			}
		</script>
		<script type="text/javascript" src="../js/common.js"></script>
		<style>
			.header {
				height: 2.4rem;
			}
			
			.mylogo {
				width: 1.42rem;
				height: 1.42rem;
				margin-top: 0.5rem;
				margin-left: 0.4rem;
				display: inline-block;
				float: left;
			}
			
			.uesr_cont {
				margin-top: 0.3rem;
			}
			
			.user_name {
				margin-left: 0.4rem;
				font-size: 0.3rem;
				color: #323232;
			}
			
			.sex {
				margin-left: 0.4rem;
				color: #999999;
				font-size: 0.3rem;
			}
			
			.leave {
				margin-left: 0.7rem;
				color: #646464;
				font-size: 0.3rem;
			}
			
			.user_phone {
				margin-left: 0.4rem;
				color: #999999;
				font-size: 0.3rem;
			}
			
			.pname {
				margin-left: 0.4rem;
				font-size: 0.3rem;
				color: #646464;
			}
			
			.gray {
				background: #F0F0F0;
				height: 0.2rem;
				width: 100%;
			}
			
			.vip {
				height: 1.5rem;
				border-bottom: 1px solid #EFEEEE;
				position: relative;
			}
			
			.vip img {
				display: inline-block;
				width: 1.1rem;
				height: 1.1rem;
				margin-top: 0.2rem;
				margin-left: 0.5rem;
			}
			
			.vip span {
				font-size: 0.36rem;
				color: #646464;
				position: absolute;
				top: 0.62rem;
				left: 3rem;
			}
			
			.vip button {
				margin-top: 0.4rem;
				margin-right: 0.5rem;
				float: right;
				font-size: 0.3rem;
				width: 1.32rem;
				height: 0.66rem;
			}
		</style>
	</head>

	<body style="background: #FFFFFF;">
		<div class="mui-content" style="background: #FFFFFF;">
			<div class="header" style="background: #FFFFFF;">
				<img src="../images/mylogo.png" class="mylogo" />
				<div style="float: left;">
					<p class="uesr_cont"><span class="user_name"></span><span class="sex"></span>&nbsp;&nbsp;<span class="level"></span></p>
					<p class="user_phone"></p>
					<p class="pname">我的推荐人：<span></span></p>
				</div>
			</div>
			<div class="gray"></div>
			<div class="vip">
				<img src="../images/vip.png" />
				<span>vip会员</span>
				<button type="button" class="mui-btn mui-btn-danger vip">开通</button>
			</div>
			<div class="vip">
				<img src="../images/gold.png" />
				<span>金钻会员</span>
				<button type="button" class="mui-btn mui-btn-danger gold">开通</button>
			</div>
		</div>

	</body>

</html>
<script>
	document.querySelector(".user_name").innerHTML = sessionStorage.userName;
	document.querySelector(".user_phone").innerHTML = sessionStorage.mobile;
	if (sessionStorage.pname == "undefined") {
		document.querySelector(".pname span").innerText = "无推荐人";
	} else {
		document.querySelector(".pname span").innerHTML = sessionStorage.pname;
	}
	if (sessionStorage.level == "gold") {
		document.querySelector(".level").innerHTML = "金钻会员";
	} 
	if (sessionStorage.level == "vip") {
		document.querySelector(".level").innerHTML = "vip";
	} 
	if (sessionStorage.level == "comm") {
		document.querySelector(".level").innerHTML = "普通会员";
	} 
	document.querySelector(".vip").addEventListener("tap", function() {
		if (sessionStorage.level!="vip"&&sessionStorage.level!="gold") {
			mui.openWindow({
				url: "leavevip.html",
			});	
		}
		else{
			mui.alert("您已经是金钻或会员，无法升级")
		}
	});
	document.querySelector(".gold").addEventListener("tap", function() {
		if (sessionStorage.level!="gold") {
			mui.openWindow({
				url: "leavegold.html",
			});
		}else{
			mui.alert("您已经是金钻，无法升级")
		}
	});
</script>